import React, { Component } from 'react';

import { Row, Col, Slider } from 'antd';
import { Container } from '../../style'


// import Desk from "./ui/Desk"
import { fromJS } from '_immutable@4.0.0-rc.12@immutable';
import connect from "./connect"

interface IProps {
  sleep: any;
  areadesk?:any
 
  
 
  
   
  }

  // interface IState {
  
  //   colCountKey:any
  //   warehouseNum:any
  //   sss:any
  // }


const colCounts:any = {};


    [2, 3, 4, 6, 8, 12].forEach((value, i) => {
      colCounts[i] = value;
    });

  

class index extends Component <IProps> {
    state = {
      colCountKey: 2,
      warehouseNum:6,
      sss:false,
      
      };
      
    
    
      onColCountChange = (colCountKey:number) => {
        // 
        this.setState({ colCountKey });
      };
    handleClick(evt:any){
      this.setState({sss:!this.state.sss})
      // console.log(this.state.sss);
    



      
      // console.log(evt.target); alert(evt.target.className)
    }
    componentDidMount(){
      console.log(this.props.sleep);
      console.log(this.props.areadesk.toUpperCase());
      // console.log(this.props.areadesk);
      if (this.props.sleep==this.props.areadesk.toUpperCase()){
        // console.log(this.props.sleep);
        // console.log(this.props.areadesk.toUpperCase());
        
        this.setState({  warehouseNum:this.state.warehouseNum+1 });

      }
      // else{
      //   this.setState({  warehouseNum:6});
      // }
     
    }



      render() {
        // if (this.props.sleep==this.props.areadesk.toUpperCase()){
        //   // console.log(this.props.sleep);
        //   // console.log(this.props.areadesk.toUpperCase());
          
        //   this.setState({  warehouseNum:this.state.warehouseNum+2 });
  
        // }else{
        //   this.setState({  warehouseNum:6});
        // }


        // console.log(this.props.areadesk.toUpperCase());

        const { colCountKey, warehouseNum} = this.state;
        const cols = [];
        //  存储
        const colCount = colCounts[colCountKey];
        let colCode = '';
        for (let i = 0; i < warehouseNum; i++) {
          cols.push(
            <Col key={i.toString()} span={24 / colCount} onClick={this.handleClick.bind(this)}>
              <div className={i.toString()} >{this.props.sleep}区-{i}货架</div>
              {/* <Desk open={this.state.sss}/> */}
            </Col>,
          );
          colCode += ` <Col span={${24 / colCount}} />\n`;
        }
        return (
          <Container >
         
            <span> 货架:{this.props.sleep}</span>
            <div style={{ width: '50%', marginBottom: 48 }}>
              {/* 进度条 */}
              {/* <Slider
                min={0}
                max={Object.keys(colCounts).length - 1}
                value={colCountKey}
                onChange={this.onColCountChange}
                marks={colCounts}
                step={null}
                tipFormatter={(value:any) => colCounts[value]}
              /> */}
            </div>
            {/* gutter={[gutters[gutterKey], vgutters[vgutterKey]]} */}
            <Row  gutter={[6,6]}  id="components-grid-demo-playground">
              {cols}
              {/* {cols} */}
            </Row>
         
          </Container >
        );
      }
}

export default connect (index);
